<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />

        <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">

        <link rel="stylesheet" href="css/jquery.mobile-1.3.1.min.css" />
        <link rel="stylesheet" href="css/jquery.mobile.iscrollview.css"/>
        <link rel="stylesheet" href="css/jquery.mobile.iscrollview-pull.css"/>
        <link rel="stylesheet" type="text/css" href="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.min.css" />         
        <link rel="stylesheet" href="css/epicrisis.css" />

        <script src="js/jquery-1.9.1.min.js"></script>

        <script type="text/javascript" src="js/graficos/jquery.jqplot.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.pieRenderer.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.logAxisRenderer.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.categoryAxisRenderer.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.pointLabels.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.barRenderer.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.canvasAxisLabelRenderer.min.js"></script>        
        <script type="text/javascript" src="js/graficos/jqplot.pyramidAxisRenderer.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.pyramidGridRenderer.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.pyramidRenderer.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.canvasTextRenderer.min.js"></script>
        <script type="text/javascript" src="js/graficos/jqplot.canvasAxisTickRenderer.min.js"></script>

        <script type="text/javascript" src="js/json2.js"></script>

        <link rel="stylesheet" type="text/css" hrf="css/jquery.jqplot.min.css" />

        <script src="js/custom-init.js"></script>
        <script src="js/jquery.mobile-1.3.1.min.js"></script>

        <script src="js/calculadoras/calculadoras.js"></script>
        <script src="js/calculadoras/riesgoCoronario.js"></script>
        <script src="js/calculadoras/fechaProbableParto.js"></script>
        <script src="js/calculadoras/scoreWellsTvp.js"></script>        

        <script src="js/iscroll.js"></script>
        <script src="js/jquery.mobile.iscrollview.js"></script>
        <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.core.min.js"></script>
        <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.calbox.min.js"></script>
        <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/i18n/jquery.mobile.datebox.i18n.es-ES.utf8.js"></script>


        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" charset="utf-8">

        // Wait for Cordova to load
        //

        document.addEventListener("deviceready", onDeviceReady, false);

        // Detecto si estoy online o offline
        document.addEventListener("offline", estoyConectado , false);
        document.addEventListener("online", estoyConectado , false);        


        // Declaro las variables globales
        var sesion_activa = false;
        var isConnected = false;


        //var url_accesso = "http://localhost:8081";
        var url_accesso = "http://www.epicrisisweb.com";

        // Cordova is ready
        function onDeviceReady() {
            if (parseFloat(window.device.version) === 7.0) {
                $(".topBar").css("padding-top", "15px");
            }
            
            // Muestro el loading
            $.mobile.loading( 'show', {text: 'Cargando...',textVisible: true,theme: 'a',html: ""});

            // Valido las condiciones de Acceso
            validarAcceso();

            // Finalizo el SplashScreen
            navigator.splashscreen.hide();                
        }

        </script>
        <title>Epicrisis</title>
    </head>
    <body>
        <!-- blank -->
        <div data-role="page" id="blank">
             <div class="ui-bar" style="border: 1px solid #0099cc;background: #33b5e5;">
                <p style="margin: 5px 0px; text-align: center;"><img src="img/logo-epicrisis-white.png"></p>
             </div>            
            <div data-role="content">
            </div><!-- /content -->
        </div><!-- fin blank -->            

        <!-- login -->
        <div data-role="page" id="login">

             <div class="ui-bar topBar" style="border: 1px solid #0099cc;background: #33b5e5;">
                <p style="margin: 5px 0px; text-align: center;"><img src="img/logo-epicrisis-white.png"></p>
             </div>

            <div class="ui-bar ui-bar-e" id="msg_offline1"  style="display:none;">
              <div>Sin conexión.</div>
            </div>
             <div data-role="content">
             	<div class="img_estadisticas" style="display:none;"></div>
                <div id="canvas">
                    <form method="post" onsubmit="botonLogin()">
                        <label> Usuario </label>
                        <input type="text" autocorrect="off" autocapitalize="off" id="usermobile" name="usermobile">

                        <label> Password </label>
                        <input type="password" id="passwordmobile" name="passwordmobile" >

                        <fieldset data-role="controlgroup">
                            <input type="checkbox" id="recordarmobile" name="recordarmobile" class="custom" />
                            <label for="recordarmobile">Recordar mis datos?</label>
                        </fieldset>

                        <input type="submit" value="Login" data-theme="b">
                    </form>
                </div>

                <a href="slides.html" rel="external" data-role="button"  data-icon="check" data-theme="e">
                    <div style="font-size: 12px;">Usuario nuevo</div>
                    <div>Comenzá a usar Epicrisis</div>
                </a>

                <div data-role="popup" id="generic_msg" class="ui-content" data-theme="a">
                    <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Cerrar</a>
                    <p id="contenido_popup"><p>
                </div>
            </div><!-- /content -->

        </div><!-- fin login -->

        <!-- turnos -->
        <div data-role="page" id="turnos">
            <div data-role="header" class="topBar" data-theme="b"  data-position="fixed" data-tap-toggle="false" data-transition="none" style="border: 1px solid #0099cc;background: #33b5e5;">
                <h1>Turnos</h1> 
                <a href="#" onclick="MostrarMenu();" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Opciones" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;"><img src="img/img-more.png"/></a>
                	<div class="menu_opciones" >
                		<ul>
                			<li><a href="#configuracion" style="color: white;">Configuración</a></li>
                			<li onclick="Logout();"><a href="#" onclick="Logout();" style="color: white;">Salir</a></li>
                		</ul>
                	</div>
                <a href="#" onclick="ActualizarTurnos('refresh');" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Actualizar" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;margin-right: 30px;"><img class="cargando" src="img/ico-refresh.png"/></a>
            </div>             

            <div class="ui-bar ui-bar-e" id="msg_offline2" style="display:none;">
              <div>Sin conexión.</div>
            </div>


            <div data-role="content" data-iscroll="">
                <div class="iscroll-pulldown">
                    <span class="iscroll-pull-icon"></span>
                    <span data-iscroll-pulled-text="Suelta el botón para actualizar..." data-iscroll-loading-text="Actualizando..." class="iscroll-pull-label">Despliega para actualizar...</span>
                </div>

            	<div class="img_estadisticas" style="display:none;"></div>
                <div id="canvas">
                    <div class="ui-grid-a">
                        <div class="ui-block-a">Desde
                            <input name="fecha_inicio" id="fecha_inicio" type="text" data-role="datebox" data-options='{"mode":"calbox", "overrideTooltip":"", "useFocus": true, "beforeToday": true, "minDays": 10}' readonly="readonly" value="24/06/2013">
                        </div>
                        <div class="ui-block-b">Hasta
                            <input name="fecha_fin" id="fecha_fin" type="text" data-role="datebox" data-options='{"mode":"calbox", "overrideTooltip":"", "useFocus": true, "afterToday": true, "maxDays": 30}' readonly="readonly" value="01/06/2013">                        
                        </div>
                    </div>
             
                    <ul data-role="listview" id="listado_turnos" data-filter-theme="c" class="ui-listview ui-listview-inset ui-corner-all "></ul>
                </div>                

            </div><!-- /content -->


            <div data-role="footer" data-position="fixed">
                <div data-role="navbar" data-position="fixed" data-tap-toggle="false"  >
                    <ul >
                        <li class="ui-block-a">
                            <a href="#" onclick="irA('turnos')" data-theme="a" class="ui-btn-active ui-state-persist"><div><img src="img/ico-turnos.png"></div><span class="ui-btn-text">Turnos</span></a>
                        </li>
                        <li class="ui-block-b">
                            <a href="#pacientes" data-theme="a" ><div><img src="img/ico-pacientes.png"></div><span class="ui-btn-text">Pacientes</span></a>
                        </li>
                        <li class="ui-block-c">
                            <a href="#calculadoras" data-theme="a" ><div><img src="img/ico-calculator.png"></div><span class="ui-btn-text">Score</span></a>
                        </li>
                        <li class="ui-block-d">
                            <a href="#estadisticas" data-theme="a" ><div><img src="img/ico-estadisticas.png"></div><span class="ui-btn-text">Reporte</span></a>
                        </li>
                    </ul>
                </div><!-- /navbar -->  
            </div><!-- /footer -->

        </div><!-- fin turnos -->


        <!-- pacientes -->
        <div data-role="page" id="pacientes" >
            <div data-role="header" class="topBar" data-theme="b"  data-position="fixed" data-tap-toggle="false" data-transition="none" style="border: 1px solid #0099cc;background: #33b5e5;">
                <h1>Pacientes</h1>
                <a href="#" onclick="MostrarMenu();" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Opciones" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;"><img src="img/img-more.png"/></a>
                	<div class="menu_opciones" >
                		<ul>
                			<li><a href="#configuracion" style="color: white;">Configuración</a></li>
                			<li onclick="Logout();"><a href="#" onclick="Logout();" style="color: white;">Salir</a></li>
                		</ul>
                	</div>                
                <a href="#" onclick="ActualizarPacientes('refresh');" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Actualizar" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;margin-right: 30px;"><img class="cargando" src="img/ico-refresh.png" /></a>
            </div>             

            

            <div class="ui-bar ui-bar-e" id="msg_offline3" style="display:none;">
              <div>Sin conexión.</div>
            </div>

            <div data-role="content" data-iscroll="">
                <div class="iscroll-pulldown">
                    <span class="iscroll-pull-icon"></span>
                    <span data-iscroll-pulled-text="Suelta el botón para actualizar..." data-iscroll-loading-text="Actualizando..." class="iscroll-pull-label">Despliega para actualizar...</span>
                </div>

            	<div class="img_estadisticas" style="display:none;"></div>
<!--
                <div id="listado_pacientes"></div>
                 <ul data-role="listview" data-filter-placeholder="Buscar" data-autodividers="true" data-filter="true" data-filter-theme="c" id="listado_pacientes" class="ui-listview ui-listview-inset ui-corner-all "></ul> 
-->

                <div>
                    <ul id="autocomplete" data-role="listview" data-inset="true" data-autodividers="true" data-filter="true" data-filter-placeholder="Buscar un paciente..." data-filter-theme="d"></ul>
                </div>
                <div id="canvas">
                    <div id="prog"></div>
                    <div id="listado_pacientes" class="ui-listview ui-listview-inset ui-corner-all "></div>
                </div>

		        <div class="iscroll-pullup">
		            <span class="iscroll-pull-icon"></span>
		            <span data-iscroll-pulled-text="Para ver más datos, utilice el buscador" data-iscroll-loading-text="Actualizando..." class="iscroll-pull-label">Para ver más datos, utilice el buscador</span>
		        </div>

            </div>

            <div data-role="footer" data-position="fixed">
                <div data-role="navbar" data-position="fixed" data-tap-toggle="false"  >
                    <ul >
                        <li class="ui-block-a">
                            <a href="#" onclick="irA('turnos')"  data-theme="a"><div><img src="img/ico-turnos.png"></div><span class="ui-btn-text">Turnos</span></a>
                        </li>
                        <li class="ui-block-b">
                            <a href="#pacientes" data-theme="a" class="ui-btn-active ui-state-persist"><div><img src="img/ico-pacientes.png"></div><span class="ui-btn-text">Pacientes</span></a>
                        </li>
                        <li class="ui-block-c">
                            <a href="#calculadoras" data-theme="a" ><div><img src="img/ico-calculator.png"></div><span class="ui-btn-text">Score</span></a>
                        </li>
                        <li class="ui-block-d">
                            <a href="#estadisticas" data-theme="a" ><div><img src="img/ico-estadisticas.png"></div><span class="ui-btn-text">Reporte</span></a>
                        </li>
                    </ul>
                </div><!-- /navbar -->
            </div><!-- /footer -->

        </div><!-- fin pacientes -->


        <!-- estadisticas -->
        <div data-role="page" id="estadisticas">
            <div data-role="header" class="topBar" data-theme="b"  data-position="fixed" data-tap-toggle="false" data-transition="none" style="border: 1px solid #0099cc;background: #33b5e5;">
                <h1>Estadísticas</h1> 
                <a href="#" onclick="MostrarMenu();" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Opciones" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;"><img src="img/img-more.png"/></a>
                	<div class="menu_opciones" >
                		<ul>
                			<li><a href="#configuracion" style="color: white;">Configuración</a></li>
                			<li onclick="Logout();"><a href="#" onclick="Logout();" style="color: white;">Salir</a></li>
                		</ul>
                	</div>                
                <a href="#" onclick="ActualizarEstadisticas('refresh');" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Actualizar" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;margin-right: 30px;"><img class="cargando" src="img/ico-refresh.png"/></a>
            </div>      
            

            <div class="ui-bar ui-bar-e" id="msg_offline4" style="display:none;">
              <div>Sin conexión.</div>
            </div>

            <div data-role="content" data-iscroll="">
                <div class="iscroll-pulldown">
                    <span class="iscroll-pull-icon"></span>
                    <span data-iscroll-pulled-text="Suelta el botón para actualizar..." data-iscroll-loading-text="Actualizando..." class="iscroll-pull-label">Despliega para actualizar...</span>
                </div>

            	<div class="img_estadisticas" style="display:none;"></div>
<style>

    #datos_turnos .jqplot-xaxis-tick {
        font-size: 10px;
    }

    #datos_piramide .jqplot-yaxis-tick {
        font-size: 12px;
        z-index: 20;
        width: 50px;
    }
</style>


                <div id="canvas" style="height: 2500px;">
                    <div id="datos_problemas" style="width:100%;"></div>
                    <div id="ref_problemas" style="margin-bottom: 30px;border-top: 2px solid lightsteelblue; clear: both;"></div>
                    <div id="datos_practicas" style="width:100%;margin-bottom: 30px;"></div>
                    <div id="ref_practicas" style="margin-bottom: 30px;border-top: 2px solid lightsteelblue; clear: both;"></div>
                    <div id="datos_medicamentos" style="width:100%;margin-bottom: 30px;"></div>
                    <div id="ref_medicamentos" style="margin-bottom: 30px;border-top: 2px solid lightsteelblue; clear: both;"></div>
                    <div id="datos_turnos" style="width:100%;margin-bottom: 30px;"></div>
                    <div id="datos_piramide" style="width:100%;height: 500px;margin-bottom: 30px;"></div>
                </div>

                <div data-role="popup" id="popup_estadisticas" class="ui-content" data-theme="a">
                    <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Cerrar</a>
                    <p id="contenido_popup_estadisticas"><p>
                </div>                            

            </div>


            <div data-role="footer" data-position="fixed">
                <div data-role="navbar" data-position="fixed" data-tap-toggle="false"  >
                    <ul >
                        <li class="ui-block-a">
                            <a href="#turnos" data-theme="a"><div><img src="img/ico-turnos.png"></div><span class="ui-btn-text">Turnos</span></a>
                        </li>
                        <li class="ui-block-b">
                            <a href="#pacientes" data-theme="a"><div><img src="img/ico-pacientes.png"></div><span class="ui-btn-text">Pacientes</span></a>
                        </li>
                        <li class="ui-block-c">
                            <a href="#calculadoras" data-theme="a" ><div><img src="img/ico-calculator.png"></div><span class="ui-btn-text">Score</span></a>
                        </li>
                        <li class="ui-block-d">
                            <a href="#estadisticas" data-theme="a" class="ui-btn-active ui-state-persist"><div><img src="img/ico-estadisticas.png"></div><span class="ui-btn-text">Reporte</span></a>
                        </li>
                    </ul>
                </div><!-- /navbar -->
            </div><!-- /footer -->


        </div><!-- fin estadisticas -->

        <!-- detalle pacientes -->
        <div id="detailsPage" data-role="page" data-add-back-btn="true">
            <div data-role="header" class="topBar" data-theme="b"  data-position="fixed" data-tap-toggle="false" data-transition="none" style="border: 1px solid #0099cc;background: #33b5e5;">
                <h1>Paciente</h1>
                <a href="#" onclick="MostrarMenu();" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Opciones" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;"><img src="img/img-more.png"/></a>
                	<div class="menu_opciones" >
                		<ul>
                			<li><a href="#configuracion" style="color: white;">Configuración</a></li>
                			<li onclick="Logout();"><a href="#" onclick="Logout();" style="color: white;">Salir</a></li>
                		</ul>
                	</div>                
                <a href="#" id="refresh_detalle_paciente" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Actualizar" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;margin-right: 30px;"><img class="cargando" src="img/ico-refresh.png" /></a>
            </div>

            <div class="ui-bar ui-bar-e" id="msg_offline5" style="display:none;">
              <div>Sin conexión.</div>
            </div>

            <div data-role="content">
            	<div class="img_estadisticas" style="display:none;"></div>

                <div id="canvas">
                   <div class="ui-li-aside ui-li-desc" style="width:52px;">
                       <div id="phone"></div>
                       <div id="email"></div>
                   </div>
                   <h3 id="fullname"></h3>                   
                   <p id="fecha_nacimiento"></p>                   
                   <p id="documento"></p>                   
                   <p id="direccion"></p>
                   <p id="sexo"></p>
                   <p id="grupo-sanguineo"></p>                   
                   <p id="ooss"></p>
                   <p id="tags"></p>
                </div>


                <div id="canvas" style="margin-top: 15px;">
                   <h3>Cronología</h3>
                   <div id="contenido_cronologia"></div>
                </div>  

                <div data-role="popup" id="popup_paciente" class="ui-content" data-theme="a">
                    <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Cerrar</a>
                    <p id="contenido_popup_paciente"><p>
                </div>     
            </div>


            <div data-role="footer" data-position="fixed" style="border-top: 1px solid #aaa; background: #f1efed; padding: 3px;">
                    <div class="ui-grid-a">
                        <div class="ui-block-a" style="width: 85%;"><textarea autocorrect="off" autocapitalize="off" cols="40" rows="8" name="txt_evolucion" id="txt_evolucion" placeholder="Evolucionar al paciente" class="ui-bar-c" data-mini="true" style="
                            background: #f1efed; 
                            -webkit-box-shadow: none;
                            box-shadow: none;
                            border: none;
                            border-bottom: 1px solid #0099cc;
                            height: 30px !important;
                            line-height: none;
                            border-radius: 0em;
                            -webkit-border-radius: 0em;
                            "></textarea><input type="hidden" id="person_id" value=""></div>
                        <div class="ui-block-b" style="width: 15%;"><input type="button" onclick="guardarEvolucion();" data-icon="edit" data-iconpos="notext" data-theme="b" data-mini="true"></div>
                    </div>
            </div><!-- /footer -->

        </div><!-- fin detalle pacientes -->


        <!-- calculadoras -->
        <div data-role="page" id="calculadoras" >
            <div data-role="header" class="topBar" data-theme="b"  data-position="fixed" data-tap-toggle="false" data-transition="none" style="border: 1px solid #0099cc;background: #33b5e5;">
                <h1>Calculadoras</h1> 
                <a href="#" onclick="MostrarMenu();" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Opciones" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;"><img src="img/img-more.png"/></a>
                	<div class="menu_opciones" >
                		<ul>
                			<li><a href="#configuracion" style="color: white;">Configuración</a></li>
                			<li onclick="Logout();"><a href="#" onclick="Logout();" style="color: white;">Salir</a></li>
                		</ul>
                	</div>
            </div>             

            <div class="ui-bar ui-bar-e" id="msg_offline6" style="display:none;">
              <div>Sin conexión.</div>
            </div>


            <div data-role="content">
            	<div class="img_estadisticas" style="display:none;"></div>

					<ul data-role="listview" id="listado_calculadoras" >
					  <li>
					  	<a href="#detailsCalculator1">
					  	<h3>Riesgo Coronario</h3>
					  	<p>Based on Wilson, D'Agostino, Levy et al.</p>
					  	<p>'Prediction of Coronary Heart Disease using</p>
					  	<p>Risk Factor Categories', Circulation 1998</p>
					  	</a>
					  </li>

					  <li>
					  	<a href="#detailsCalculator3">
					  	<h3>Fecha Probable de Parto</h3>
					  	<p>Calculada sumando 280 días (40 semanas)</p>
					  	<p>a la fecha de ultima mentruación (FUM).</p>
					  	</a>
					  </li>

					  <li>
					  	<a href="#detailsCalculator2">
					  	<h3>TVP (Wells)</h3>
					  	<p>Score de Wells para la predicción de</p>
					  	<p>Trombosis Venosa Profunda.</p>
					  	</a>
					  </li>

					</ul>             

            </div><!-- /content -->


            <div data-role="footer" data-position="fixed">
                <div data-role="navbar" data-position="fixed" data-tap-toggle="false"  >
                    <ul >
                        <li class="ui-block-a">
                            <a href="#" onclick="irA('turnos')" data-theme="a" ><div><img src="img/ico-turnos.png"></div><span class="ui-btn-text">Turnos</span></a>
                        </li>
                        <li class="ui-block-b">
                            <a href="#pacientes" data-theme="a" ><div><img src="img/ico-pacientes.png"></div><span class="ui-btn-text">Pacientes</span></a>
                        </li>
                        <li class="ui-block-c">
                            <a href="#calculadoras" data-theme="a" class="ui-btn-active ui-state-persist"><div><img src="img/ico-calculator.png"></div><span class="ui-btn-text">Score</span></a>
                        </li>
                        <li class="ui-block-d">
                            <a href="#estadisticas" data-theme="a"><div><img src="img/ico-estadisticas.png"></div><span class="ui-btn-text">Reporte</span></a>
                        </li>
                    </ul>
                </div><!-- /navbar -->  
            </div><!-- /footer -->

        </div><!-- fin calculadoras -->



        <!-- detalle calculadora1 -->
        <div id="detailsCalculator1" data-role="page" data-add-back-btn="true">
            <div data-role="header" class="topBar" data-theme="b"  data-position="fixed" data-tap-toggle="false" data-transition="none" style="border: 1px solid #0099cc;background: #33b5e5;">
                <h1>Calculadoras</h1>
            </div>

            <div data-role="content">
                <div id="canvas">

                    <h2>Riesgo Coronario a 10 años</h2>
                    <p>
                        <em>
                            Basado en Wilson, D'Agostino, Levy et al. 'Prediction of Coronary Heart Disease using Risk Factor Categories', Circulation 1998
                        </em>
                    </p>
                    <form>
                            <label>Edad</label>
                            <input id="edad" type="number" placeholder="Años…">
                            <label>Sexo</label>
                            <select id="genero">
                                <option>Masculino</option>
                                <option>Femenino</option>
                            </select>
                            <label>Colesterol Total</label>
                            <input id="colesterolTotal" type="number" placeholder="Mg/dl…">
                            <label>HDL</label>
                            <input id="hdl" type="number" placeholder="Mg/dl…">
                            <label>TA Sistólica</label>
                            <input id="sistolica" type="number" placeholder="mmHg…">
                            <label>TA Diastólica</label>
                            <input id="diastolica" type="number" placeholder="mmHg…">
                            <label class="checkbox">
                                <input id="fumador" type="checkbox">Fumador
                            </label>
                            <label class="checkbox">
                                <input id="diabetes" type="checkbox">Diabetes
                            </label>
                    </form>


                    <p><a data-role="button" data-theme="e" href="javascript:void(0);" onclick="calcRiesgCor();">Calcular</a></p>
                    <h4>Resultado: <span id="resultadoRiesgoCoronario"></span>%</h4>

                </div>  
            </div>
        </div><!-- fin detalle calculadora1 -->




        <!-- detalle calculadora2 -->
        <div id="detailsCalculator2" data-role="page" data-add-back-btn="true">
            <div data-role="header" class="topBar" data-theme="b"  data-position="fixed" data-tap-toggle="false" data-transition="none" style="border: 1px solid #0099cc;background: #33b5e5;">
                <h1>Calculadoras</h1>
            </div>

            <div data-role="content">
                <div id="canvas">

                    <h2>TVP (Wells)</h2>
                    <p>Score de Wells para la predicción de Trombosis Venosa Profunda.</p>
                    <form>
                        <strong>Criterios</strong>
                        <label>
                            <input id="cancer" type="checkbox">Cancer activo, en tratamiento dentro de los 6 meses, o en tratamiento paliativo
                        </label>
                        <label>
                            <input id="paralisis" type="checkbox">Parálisis, paresia o inmovilización de miembros inferiores
                        </label>
                        <label>
                            <input id="cirugia" type="checkbox">Postración en cama por más de 3 días por una cirugía (dentro de las 4 semanas)
                        </label>
                        <label>
                            <input id="sensibilidad" type="checkbox">Sensibilidad localizada a lo largo de la distribución de las venas profundas
                        </label>
                         <label>
                            <input id="hinchazon-completa" type="checkbox">Hinchazón completa del miembro
                        </label>
                        <label>
                            <input id="hinchazon-pantorrilla" type="checkbox">Hinchazón unilateral de la pantorrilla mayor de 3 cm (debajo de la tuberosidad tibial)
                        </label>
                        <label>
                            <input id="edema" type="checkbox">Edema unilateral pitting
                        </label>
                        <label>
                            <input id="varices" type="checkbox">Venas superficiales colaterales
                        </label>
                        <label>
                            <input id="dx-alternativo" type="checkbox">Diagnóstico alternativo tan o más probable que TVP
                        </label>
                    </form>
                    <p><a data-role="button" data-theme="e" href="javascript:void(0);" onclick="calcTvp();">Calcular</a></p>
                    
                    <h4>Resultado: <span id="resultadoTvp"></span></h4>

                </div>  
            </div>
        </div><!-- fin detalle calculadora2 -->


        <!-- detalle calculadora3 -->
        <div id="detailsCalculator3" data-role="page" data-add-back-btn="true">
            <div data-role="header" class="topBar" data-theme="b"  data-position="fixed" data-tap-toggle="false" data-transition="none" style="border: 1px solid #0099cc;background: #33b5e5;">
                <h1>Calculadoras</h1>
            </div>

            <div data-role="content">
                <div id="canvas">

                    <h2>Fecha Probable de Parto</h2>
                    <p>Calculada sumando 280 días (40 semanas) a la fecha de ultima mentruación (FUM). </p>
                    <div>
						<input id="fum" name="fum" type="text" data-role="datebox" data-options='{"mode":"calbox", "useFocus": true, "beforeToday": true}' readonly="readonly">
                    </div>
                    <p><a data-role="button" data-theme="e" href="javascript:void(0);" onclick="calcFpp();">Calcular</a></p>
                    <h4>Resultado: <span id="resultadoFpp"></span></h4>

                </div>  
            </div>
        </div><!-- fin detalle calculadora3 -->




        <!-- configuracion -->
        <div id="configuracion" data-role="page" data-add-back-btn="true">
            <div data-role="header" class="topBar" data-theme="b"  data-position="fixed" data-tap-toggle="false" data-transition="none" style="border: 1px solid #0099cc;background: #33b5e5;">
                <h1>Configuración</h1>
                <a href="#" onclick="MostrarMenu();" data-mini="true" data-shadow="false" data-iconshadow="false"  data-theme="b" title="Opciones" class="ui-btn-right ui-btn ui-mini topBar" style="border: none; background: none;"><img src="img/img-more.png"/></a>
                	<div class="menu_opciones" >
                		<ul>
                			<li><a href="#configuracion" style="color: white;">Configuración</a></li>
                			<li onclick="Logout();"><a href="#" onclick="Logout();" style="color: white;">Salir</a></li>
                		</ul>
                	</div>
            </div>

            <div class="ui-bar ui-bar-e" id="msg_offline7" style="display:none;">
              <div>Sin conexión.</div>
            </div>

            <div data-role="content" data-theme="b">
            	<div class="img_estadisticas" style="display:none;"></div>

				<h3>Cuenta</h3>
                <div id="canvas" style="margin-top: 15px;">
					<p>Al guardar los datos de acceso, no es necesario ingresarlos cada vez que se accede a la aplicación.</p>
	                <input type="text" id="txtNombreCuenta" autocorrect="off" autocapitalize="off" placeholder="Usuario de acceso" >
	                <input type="password" id="txtPasswordCuenta" autocorrect="off" autocapitalize="off" placeholder="Contraseña de acceso" >
	                <span id="btn_guardar_cuenta" ><input type="button" value="Guardar" data-inline="true" data-mini="true" data-theme="b" onclick="btnGuardarConfiguraqcion();"></span>
                </div>  

				<h3>Recursos</h3>                

				<ul data-role="listview" class="ui-listview ui-listview-inset ui-corner-all ">
                    <li id="marketandroid" style="display:none;">
                        <a href="market://details?id=com.epicrisisweb.mobile">
                            <h3>¿Te gusta Epicrisis?</h3>
                            <p>Dejanos tu calificación en Google Play</p>
                        </a>
                    </li>
                    <li id="marketios" style="display:none;">
                        <a href="https://itunes.apple.com/us/app/apple-store/id375380948?mt=8">
                            <h3>¿Te gusta Epicrisis?</h3>
                            <p>Dejanos tu calificación en el App Store</p>
                        </a>
                    </li>
            		<li>
                        <a href="#" onclick="window.open('http://www.epicrisisweb.com/blog/', '_blank', 'location=no,closebuttoncaption=Volver');" class="ui-link" target="_blank" rel="external">
                            <h3>Blog de Epicrisis</h3>
                            <p>Conocé todos los avances y novedades</p>
                        </a>
                        
                    </li>
                    <li>
                        <a href="#" onclick="window.open('http://www.facebook.com/epicrisis', '_blank', 'location=no,closebuttoncaption=Volver');" class="ui-link" target="_blank" rel="external">
                            <h3>Epicrisis en Facebook</h3>
                        </a>
                    </li>
                    <li>
                        <a href="#" onclick="window.open('http://www.epicrisisweb.com/politica', '_blank', 'location=no,closebuttoncaption=Volver');" class="ui-link" target="_blank" rel="external">
                            <h3>Política de privacidad</h3>
                        </a>
                    </li>
                    <li>
                        <a href="#" onclick="window.open('http://www.epicrisisweb.com/politica', '_blank', 'location=no,closebuttoncaption=Volver');" class="ui-link" target="_blank" rel="external">
                            <h3>Aviso Legal</h3>
                        </a>
                    </li>
                </ul>
					

            </div>
        </div><!-- fin configuracion -->



    </body>
</html>